<template>
  <div id="helpCore">
    <ul>
      <li class="problem" @click="toMsg(0)">
        关于会员卡
        <img
          src="https://tsyx-rights-and-interests.oss-cn-hangzhou.aliyuncs.com/icon/chevron_forward.png"
          alt=""
        />
      </li>
      <li class="problem" @click="toMsg(1)">
        关于会员权益
        <img
          src="https://tsyx-rights-and-interests.oss-cn-hangzhou.aliyuncs.com/icon/chevron_forward.png"
          alt=""
        />
      </li>
      <li class="problem" @click="toMsg(2)">
        关于商品
        <img
          src="https://tsyx-rights-and-interests.oss-cn-hangzhou.aliyuncs.com/icon/chevron_forward.png"
          alt=""
        />
      </li>
      <li class="problem" @click="toMsg(3)">
        关于身份认证
        <img
          src="https://tsyx-rights-and-interests.oss-cn-hangzhou.aliyuncs.com/icon/chevron_forward.png"
          alt=""
        />
      </li>
    </ul>
  </div>
</template>

<script>
export default {
    methods: {
        toMsg(id) {
            this.$router.push({name: 'helpMsg', query: {id}})
        }
    }
};
</script>

<style lang="scss" scoped>
#helpCore {
  padding: 1rem 0;
}
.problem {
  position: relative;
  width: 95%;
  padding: 0.4rem;
  box-sizing: border-box;
  font-size: 0.4rem;
  background-color: #fff;
  margin: 0.4rem auto;
  box-shadow: 0px 10px 35px 0px rgba(198, 198, 198, 0.36);
  img {
    position: absolute;
    right: 0.1rem;
    top: 50%;
    transform: translateY(-50%);
    width: 0.5rem;
  }
}
</style>